﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.Master" AutoEventWireup="true"
    CodeBehind="frmCardapio.aspx.cs" Inherits="Prj_PedidoFacil_Cliente.frmCardapio" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <%--<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">--%>
    <div class="row">
        <div class="col-md-12">
        <ul class="nav nav-tabs tabsController">
        <li class="active"'>
            <a href="frmCardapio.aspx">Cardápio</a>
        </li>
        <li >
            <a href="#">Acompanhamento</a>
        </li>
        <li>
            <a href="#">Bebida</a>
        </li>
    </ul>
        </div>
    </div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row"><div class="col-md-12"></div></div>
    <div class="row">
        <div class="col-md-12">
            <div id="boxCarrinhoDeCompras" class="alert alert-info pull-right" role="alert">
                <p class="text-right">
                    Total Carrinho de Compras</p>
                <p class="text-right">
                    <b>
                        <h4 id="totalCarrinhoDeCompras" class="text-right">
                            R$ 0.00</h4>
                    </b>
                </p>
            </div>
            <div class="col-md-4">
                <table>
                    <tr>
                        <td>
                            <asp:DropDownList ID="ddlTipoRefeicao" class="form-control" runat="server" DataTextField="SUBMENU"
                                DataValueField="ID_SUBMENU">
                                <asp:ListItem Value="0">Selecione um tipo de Refeição</asp:ListItem>
                            </asp:DropDownList>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-10 table-responsive center-block">
            <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
                <asp:Repeater ID="cardapio" runat="server">
                    <HeaderTemplate>
                        <table border="1" class="table table-bordered table-condensed">
                            <tr>
                                <th>
                                    PRODUTO
                                </th>
                                <th>
                                    VALOR
                                </th>
                                <th>
                                    QTDE
                                </th>
                                <th>
                                    TOTAL
                                </th>
                                <th>
                                    OBS
                                </th>
                            </tr>
                    </HeaderTemplate>
                    <ItemTemplate>
                        <tr>
                            <td class="text-right">
                                <asp:Label runat="server" ID="idProduto" Text='<%# Eval("ID_PRODUTO")%>' ></asp:Label>
                            </td>
                            <td>
                                <%--<a href="#" onclick="verDetalhes(<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>)">
                                    <%# DataBinder.Eval(Container.DataItem, "PRODUTO") %>
                                </a>--%>
                                <div class="panel panel-default" data-toggle="collapse" data-target="#collapse<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                            <a href="#"><b>
                                                <%# DataBinder.Eval(Container.DataItem, "PRODUTO") %></b></a>
                                        </h4>
                                    </div>
                                    <div id="collapse<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>" class="panel-collapse collapse">
                                        <div class="panel-body">
                                            <%# DataBinder.Eval(Container.DataItem, "QTD_ACOMPANHAMENTO")%>
                                            Itens de Acompanhamento
                                        </div>
                                    </div>
                                </div>
                            </td>
                            <td class="text-right">
                                R$
                                <%# DataBinder.Eval(Container.DataItem, "VALOR")%>
                            </td>
                            <td>
                                <select id="qtde<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>" onchange="calcularValorTotal(<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>, <%# DataBinder.Eval(Container.DataItem, "VALOR") %>)">
                                    <option value="0">0</option>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                    <option value="5">5</option>
                                </select>
                            </td>
                            <td class="text-right">
                                R$ <span id="total<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>">0.00</span>
                            </td>
                            <td>
                                <div id="popover_content_Obs" style="display: none">
                                    <asp:Label ID="lblObsHidden" runat="server" Visible="false"></asp:Label>
                                    <textarea id="txtObs<%# DataBinder.Eval(Container.DataItem, "ID_PRODUTO") %>"></textarea>
                                </div>
                                <a href="#" class="popoverObs" data-toggle="popover" data-rel="tooltip"><i class="fa fa-cog bigger-130">
                                </i></a>
                            </td>
                        </tr>
                    </ItemTemplate>
                    <FooterTemplate>
                        </table>
                    </FooterTemplate>
                </asp:Repeater>
            </div>
        </div>
    </div>
    <%--</div>--%>
    <script src="template/js/jquery.min.js" type="text/javascript"></script>
    <script src="template/libs/bootstrap-3.1.1/js/bootstrap.min.js" type="text/javascript"></script>
    <script>
        function verDetalhes(idProduto) {
            alert("ID PRODUTO: " + idProduto);
        }

        function calcularValorTotal(idProduto, valorProduto) {
            var qtde = document.getElementById("qtde" + idProduto).value;
            var valorTotalProduto = qtde * valorProduto;

            document.getElementById("total" + idProduto).innerHTML = "" + valorTotalProduto.toFixed(2);
        }

        function getObs(obs) {
            alert(obs);
        }

        $(document).ready(function () {

            $('.popoverObs').popover({
                title: '<b>Observação</b>&nbsp;&nbsp;&nbsp; <button class="close" data-toggle="clickover" data-dismiss="popover" aria-hidden="true" onclick="$(\'.popoverObs\').popover(\'hide\');">&times;</button>',
                placement: 'left',
                trigger: 'click',
                container: 'body',
                content: function () {
                    return $('#popover_content_Obs').html();
                },
                html: true
            });

        });
    </script>
</asp:Content>
